﻿///<reference path="jquery-1.5.1.js" />

(function ($) {
    //定義jquere對象的擴展方法autoSearchText
    $.fn.autoSearchText = function (options) {
        //以下为该插件的属性及其默认值
        var deafult = {
            itemsid: "autoSearchItem",
            itemswidth: 200,           //文本框宽
            itemsHeight: 150,      // 下拉框高
            minoSearchLength: 1,            //最小字符数(从第几个开始搜索)
            datafn: null,         //加载数据函数，第一個參數為輸入的內容
            datafnPara2: null,    //加載數據函數的第二個參數
            callBackfn: null,            //选择项后触发的回调函数
            copyobj:null   //賦值的同時賦值另一個對象
        };
        var ops = $.extend(deafult, options);
        if (ops.datafn == null) {
            console.log('加载数据函数為必填項');
            return;
        }
        $(this).width(ops.itemswidth);
        var textDefault = $(this).val();
        $(this).focus(function () {
            if ($(this).val() == textDefault) {
                $(this).val('');
                $(this).css('color', 'black');
            }
        });
        if(ops.itemsid=="autoSearchItem") ops.itemsid=Math.random().toString(36).substring(2);
        if ($("[id=" + ops.itemsid + "]").length == 0)
        {
        	var autoSearchItem = '<div id="' + ops.itemsid + '" class="autoSearchItem" class="autoSearchItem"><ul class="menu_v"></ul></div>';
        	$(this).after(autoSearchItem);
        }
        var autoSearchItemIndex = -1;
        /*鼠标按下键时，显示下拉框，并且划过项时改变背景色及赋值给输入框*/
        $(this).bind('keydown', function (e) {
            if ($(this).val().length < ops.minoSearchLength) return;
            $("[id=" + ops.itemsid + "]").css('visibility', 'visible');
            var itemCount = $("[id=" + ops.itemsid + "] li").length;
            switch (e.keyCode) {
                case 38:   //上
                    if (autoSearchItemIndex > 0) {
                        autoSearchItemIndex--;
                    }
                    var itemsliTop=$("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").offset().top;
                    var itemsliHeight=$("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").height();
                    var itemsdivTop=$("[id=" + ops.itemsid + "]").offset().top
                    var itemsdivHeight=$("[id=" + ops.itemsid + "]").height();
                    $("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").css({ 'background': '#007fff', 'color': 'white' });

                    if (itemsliTop+itemsliHeight >itemsdivTop+itemsdivHeight || itemsliTop<itemsdivTop)
                        $("[id=" + ops.itemsid + "]").scrollTop($("[id=" + ops.itemsid + "]").scrollTop() - (itemsdivTop - itemsliTop));

                    //$(this).val($("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").find('font').text());
                    //if(ops.copyobj!=null) $("[id=" +ops.copyobj +"]").val($("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").find('font').text());
                    if (autoSearchItemIndex < itemCount - 1) $("[id=" + ops.itemsid + "] li:eq(" + (autoSearchItemIndex + 1) + ")").css({ 'background': 'white', 'color': 'black' });
                    break;
                case 40: //下
                    if (autoSearchItemIndex < itemCount - 1) {
                        autoSearchItemIndex++;
                    }
                    $("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").css({ 'background': '#007fff', 'color': 'white' });
                    var itemsliTop=$("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").offset().top;
                    var itemsliHeight=$("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").height();
                    var itemsdivTop=$("[id=" + ops.itemsid + "]").offset().top
                    var itemsdivHeight=$("[id=" + ops.itemsid + "]").height();
                    if (itemsliTop+itemsliHeight >itemsdivTop+itemsdivHeight || itemsliTop<itemsdivTop)
                        $("[id=" + ops.itemsid + "]").scrollTop((itemsliTop+itemsliHeight)-(itemsdivTop+itemsdivHeight)+$("[id=" + ops.itemsid + "]").scrollTop());
                    //$(this).val($("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").find('font').text());
                    //if(ops.copyobj!=null) $("[id=" +ops.copyobj +"]").val($("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").find('font').text());
                    if (autoSearchItemIndex > 0) {
                        $("[id=" + ops.itemsid + "] li:eq(" + (autoSearchItemIndex - 1) + ")").css({ 'background': 'white', 'color': 'black' });
                    }
                    break;
                case 13:  //Enter
                    if (autoSearchItemIndex > -1 && autoSearchItemIndex < itemCount) {
                        $(this).val($("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").find('font').text());
                        if(ops.copyobj!=null) $("[id=" +ops.copyobj +"]").val($("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").find('font').text());
                        if (ops.callBackfn != null) ops.callBackfn($(this).val());
                        $("[id=" + ops.itemsid + "]").css('visibility', 'hidden');
                    }
                    break;
                 case 9:
                 case 27:
                    $("[id=" + ops.itemsid + "]").css('visibility', 'hidden');
                    break;
                 default:
                    break;
            }
        });

        $(this).bind('keyup', function (e) {
            switch (e.keyCode) {
                case 38:
                case 40:
                case 13:
                case 9:
                case 27:
                    break;
                default:
                    $("[id=" + ops.itemsid + "]").css({ 'visibility': 'visible' });
                    var data = ops.datafn($(this).val(), ops.datafnPara2);
                    initItem($(this), ops, data);
                    autoSearchItemIndex = -1;
                    break;
            }
        });
        var thisid='other';
        $(this).bind('click', function (e) {
        	if ($("[id=" + ops.itemsid + "]").length > 0)
        		{
        			if ($(this).val().length < ops.minoSearchLength){
        				$("[id=" + ops.itemsid + "]").css('visibility', 'hidden');
        				thisid='other';
        			}

        			else{
        				$("[id=" + ops.itemsid + "]").css({ 'visibility': 'visible' });
        				thisid=e.target.id;
        			}
        		}
        	})
        /*点击空白处隐藏下拉框*/
        $(document).click(function (e) {
        	if(e.target.id==thisid) return;
        	$("[id=" + ops.itemsid + "]").css('visibility', 'hidden');
        });
    };


    function initItem(obj, ops, data) {
        var str = "";
        if (data.length == 0) {
            $("[id=" + ops.itemsid + "]").css({ 'height': 20 });
            $("[id=" + ops.itemsid + "] ul").html('<div style="text-align:center;color:red">无符合数据<div>');
        }
        else {
            $("[id=" + ops.itemsid + "]").css({ 'height': ops.itemsHeight });
            for (var i = 1; i <= data.length; i++) {
                str += "<li><span>" + i + "/" + data.length + "</span>\r<font>" + data[i - 1] + "</font></li>";
            }
            $("[id=" + ops.itemsid + "] ul").html(str);
        }

        $("[id=" + ops.itemsid + "]").css({ 'left': obj.position().left, 'top': obj.position().top + 24, 'width': ops.itemswidth + 2 });
        /*点击项时将值赋值给搜索文本框*/
        $("[id=" + ops.itemsid + "] li").each(function () {
            $(this).bind('click', function () {
                obj.val($(this).find('font').text());
                if(ops.copyobj!=null)  $("[id=" +ops.copyobj +"]").val($(this).find('font').text());
                if (ops.callBackfn != null) ops.callBackfn($(this).find('font').text());
                $("[id=" + ops.itemsid + "]").css('visibility', 'hidden');
            });
            /*鼠标划过每项时改变背景色*/
            $(this).hover(
                function () {
                    //$("[id=" + ops.itemsid + "] li:eq(" + autoSearchItemIndex + ")").css({ 'background': 'white', 'color': 'black' });
                    //autoSearchItemIndex = $("[id=" + ops.itemsid + "] li").index($(this));
                    $(this).css({ 'background': '#007fff', 'color': 'white' });
                    //obj.val($(this).find('font').text());
                    //if(ops.copyobj!=null) $("[id=" +ops.copyobj +"]").val($(this).find('font').text());
                },
                function () {
                    $(this).css({ 'background': 'white', 'color': 'black' });
                }
            );
        });
    };
})(jQuery);